﻿<template>
  <div class="datastatistics">
    <div style="margin-top:12px">
    <el-radio v-model="radioDate" label="日" @change="reloadURL">按日期：</el-radio>
    <el-date-picker v-model="date" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" @change="reloadURL"></el-date-picker>
    <i style="margin-right: 15px"></i>
    <el-radio v-model="radioDate" label="月" @change="reloadURL">按月份：</el-radio>
    <el-date-picker v-model="month" type="month" placeholder="选择月" value-format="yyyy-MM" @change="reloadURL"></el-date-picker>
    </div>
    <iframe id="mainPicture" class="mainPicture" src></iframe>
  </div>
</template>

<script>
import { formatDate } from '@/common/js/date.js'
export default {
  data () {
    return {
      dataCheckbox_SCV: [],
      date: '',
      month: '',
      radioDate: '日'
    }
  },
  mounted () {
    this.date = formatDate(new Date(new Date() - 3600 * 1000 * 24), 'yyyy-MM-dd')
    this.month = formatDate(new Date(), 'yyyy-MM')
    this.reloadURL()
  },
  methods: {
    async reloadURL () {
      var url = 'http://111.160.78.62:9936/indexDistrictBH.html?ClientNo=' + localStorage.getItem('CLIENT_NO') + '&date='
      if (this.radioDate === '日') {
        url += this.date
      }
      if (this.radioDate === '月') {
        url += this.month
      }
      console.log(url)
      document.getElementById('mainPicture').src = url
    }
  }
}
</script>
<style scoped>
.datastatistics,
body {
  width: 100%;
  height: 100%;
  position: relative;
}
.demo-input-suffix {
  float: left;
  font-size: 15px;
  height: 32px;
  line-height: 32px;
}
.mainPicture {
  width: 100%;
  height: 96%;
  border: 1px solid darkgrey;
  position: absolute;
  left: 0;
  top: 50px;
  right: 0;
  bottom: 0;
  margin: auto;
}
</style>